<template>
  <view class="container">
    <!-- 温度弹窗 -->
    <u-popup :show="open" @close="open = false" @open="open = true">
      <view class="temperaturePopupBox">
        <view class="popup_hearder">
          <view class="cancel" @click="open = false">取消 </view>
          <view class="title">PM2.5</view>
          <view class="confirm" @click="confirm"> 完成</view>
        </view>

        <view class="common_popup_content popup_content">
          <u-radio-group
            v-model="value"
            placement="column"
            iconPlacement="right"
          >
            <u-radio :name="1" label="优" />
            <u-radio :name="2" label="良" />
            <u-radio :name="3" label="污染" /> 
          </u-radio-group>
        </view>
      </view>
    </u-popup>
  </view>
</template>
        
        <script>
export default {
  components: {},
  data() {
    return {
      //   温度弹窗开关
      open: false,
      value: 0, 
    };
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {},

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {},

  methods: {
    confirm() {
      this.open = false;
      this.$emit("confirm", this.value);
    },
  },
};
</script>
        
        <style lang="scss" scoped>
.container {
  background: #f6f7fb;
}

.temperaturePopupBox {
  padding: 25.568rpx 76.705rpx 0rpx 76.705rpx;
  background: rgba(255, 255, 255, 1);

  .popup_hearder {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  title {
    font-family: "Microsoft YaHei";
    font-size: 25.568rpx;
    font-weight: 290;
    line-height: 34.006rpx;
    text-align: center;
    color: rgba(0, 0, 0, 0.75);
  }

  .confirm {
    color: rgba(32, 132, 255, 1);
    font-family: "Microsoft YaHei";
    font-size: 27.273rpx;
    font-weight: 400;
    line-height: 36rpx;
    text-align: right;
  }
}

.popup_content {
  margin-top: 59.659rpx;
}
.cancel {
    color: rgba(109, 110, 111, 1);
    font-family: "Microsoft YaHei";
    font-size: 27.273rpx;
    font-weight: 400;
    line-height: 36rpx;
    text-align: right;
  }
</style>
        